<#include "/admin/_inc/_head.html"/>
<#include "/admin/_inc/_layout.html" />
<!DOCTYPE html>
<html lang="en">

<head>
    <@head />
</head>

<body>
    <@layout>

    <div class="wrapper wrapper-content animated fadeInRight">

        <div class="row">
            <div class="col-sm-12">
                <div class="ibox ">

                    <div class="ibox-content">
                        <div class="example-wrap">
                            <div class="example">
                                <div class="alert alert-danger" id="examplebtTableEventsResult" role="alert" style="display: none">
                                    事件结果
                                </div>
                                <div>
                                    <form  id="query_form" class="form-inline">
                                        <input name="name" type="text" class="form-control" placeholder="输入名称">
                                        <button id="btn_query" type="button" class="btn btn-info btn-sm">
                                            <i class="fa fa-search" aria-hidden="true"></i>
                                            查询
                                        </button>
                                    </form>

                                </div>
                                <div class="hr-line-dashed"></div>
                                <div class="btn-group hidden-xs" id="toolbar" role="group">

                                    <button id="btn_add" type="button" class="btn btn-info btn-sm">
                                        <i class="fa fa-plus" aria-hidden="true"></i>
                                        添加
                                    </button>

                                    <button id="btn_edit" type="button" class="btn btn-info btn-sm" >
                                        <i class="fa fa-paste" aria-hidden="true"></i> 编辑
                                    </button>

                                    <button id="btn_sync" type="button" class="btn btn-info btn-sm" >
                                        <i class="fa fa-circle-o-notch" aria-hidden="true"></i>
                                        菜单同步到微信
                                    </button>

                                    <button id="btn_remove" type="button" class="btn btn-info btn-sm">
                                        <i class="glyphicon glyphicon-trash" aria-hidden="true"></i>
                                        移除
                                    </button>
                                </div>
                            <#--<div class="hr-line-dashed"></div>-->
                                <table id="data-table"  data-mobile-responsive="true">
                                </table>
                            </div>
                        </div>

                    </div>

                </div>
            </div>

        </div>
    </div>

    </@layout>

<script src="/assets/js/plugins/bootstrap-table/bootstrap-table.js"></script>
<script src="/assets/js/plugins/bootstrap-table/extensions/mobile/bootstrap-table-mobile.js"></script>
<script src="/assets/js/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.js"></script>
    <script type="text/javascript">
        var $table = null;

        $(function () {
            initTable();
            btnEvent();
        });

        function initTable() {

            $table = $('#data-table').bootstrapTable({
                url: global.adminPath + '/wx-button/datapage',  //请求后台的URL（*）
                method: 'get',   //请求方式（*）
                //toolbar: '#toolbar',  //工具按钮用哪个容器
                striped: false,   //是否显示行间隔色
                cache: false,   //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
                pagination: true,   //是否显示分页（*）
                sortable: false,   //是否启用排序
                sortOrder: "desc",   //排序方式
                queryParams: function queryParams(params) { //传递参数（*）
                    var pars=$('#query_form').serializeJSON();
                    params = $.extend({}, params, pars);
                    params.currentPage=(params.offset/params.limit)+1;
                    params.showCount = params.limit;
                    return params;
                },
                sidePagination: "server",  //分页方式：client客户端分页，server服务端分页（*）
                pageNumber: 1,   //初始化加载第一页，默认第一页
                pageSize: 10,   //每页的记录行数（*）
                pageList: [10, 25, 50, 100], //可供选择的每页的行数（*）
                search: false,   //是否显示表格搜索，此搜索是客户端搜索，不会进服务端，所以，个人感觉意义不大
                strictSearch: true,
                showColumns: false,   //是否显示所有的列
                showRefresh: false,   //是否显示刷新按钮
                minimumCountColumns: 2,  //最少允许的列数
                clickToSelect: true,  //是否启用点击选中行
                //height: 400,   //行高，如果没有设置height属性，表格自动根据记录条数觉得表格高度
                uniqueId: "id",   //每一行的唯一标识，一般为主键列
                showToggle: false,   //是否显示详细视图和列表视图的切换按钮
                cardView: false,   //是否显示详细视图
                detailView: false,   //是否显示父子表
                columns: [
                    {
                        checkbox: true
                    },{
                        field: 'name',
                        title: '菜单名称'
                    }, {
                        field: 'perentName',
                        title: '上级菜单'
                    },{
                        title: '菜单标识',
                        field: 'buttonKey'
                    },{
                        title: '菜单类型',
                        field: 'type',
                        formatter: function (value, row, index) {
                            if (value == 'click') {
                                return '消息触发类';
                            } else if (value == 'view') {
                                return '网页链接类';
                            }
                        }
                    },
                    {
                        title: 'URL',
                        field: 'url'
                    },
                    {
                        title: '排序',
                        field: 'orders'
                    },
                    {
                        title: '创建时间',
                        field: 'createDate',
                        formatter: function (value, row, index) {
                            return new Date(value).format("yyyy-MM-dd");
                        }
                    }
                ]
            });
        }

        function btnEvent() {
            $('#btn_query').click(function () {
                $table.bootstrapTable('destroy');
                initTable();
            });
            $('#btn_add').click(function () {
                var url = global.adminPath + '/wx-button/addview';
                layer_show('添加', url, 800, 600);
            });

            $('#btn_edit').click(function () {
                var obj = $table.bootstrapTable('getSelections');

                if (obj.length != 1) {
                    layer.alert('请选择一条', {
                        icon: 7
                    });
                    return false;
                }

                var url = global.adminPath + '/wx-button/edit/' + obj[0].id;
                layer_show('编辑', url, 800, 600);
            });

            $('#btn_sync').click(function () {
                var url= global.adminPath+'/wx-button/sync';
                $.ajax({
                    type: "POST",
                    data: {},
                    dataType: 'json',
                    url:url,
                    success: function(res){
                        if(res.success){
                            layer.msg(res.message, {
                                icon: 1,
                                time: 2000, ///2秒关闭（如果不配置，默认是3秒）
                            }, function () {
                                $table.bootstrapTable('destroy');
                                initTable();
                            });
                        }else{
                            layer.msg(res.message, { icon: 2 });
                        }
                    }
                });
            });

            $('#btn_remove').click(function () {
                var obj = $table.bootstrapTable('getSelections');

                if (obj.length != 1) {
                    layer.alert('请选择一条', {
                        icon: 7
                    });
                    return false;
                }

                layer.confirm('确认要删除吗？', function (index) {
                    var data = {};

                    $.ajax({
                        type: "POST",
                        data: data,
                        dataType: 'json',
                        url: global.adminPath + '/wx-button/delete/' + obj[0].id,
                        success: function (res) {
                            if (res.success) {
                                layer.msg(res.message, {
                                    icon: 1,
                                    time: 2000, ///2秒关闭（如果不配置，默认是3秒）
                                }, function () {
                                    $table.bootstrapTable('destroy');
                                    initTable();
                                });
                            } else {
                                layer.msg(res.message, { icon: 2 });
                            }
                        }
                    });

                });
            });
        }

    </script>
</body>

</html>